<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

  <head>

  	<meta charset="utf-8">
  	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  	<meta http-equiv="x-ua-compatible" content="ie=edge">

  	<title>宠物</title>
  	<link rel="shortcut icon" href="assets/images/favourite_icon.svg">

  	<!-- fraimwork - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css">

    <!-- icon font - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/fontawesome.css">
    <link rel="stylesheet" type="text/css" href="assets/css/stroke-gap-icons.css">
    <link rel="stylesheet" type="text/css" href="assets/css/icofont.css">

    <!-- animation - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/animate.css">

    <!-- carousel - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/slick.css">
    <link rel="stylesheet" type="text/css" href="assets/css/slick-theme.css">

    <!-- popup - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/magnific-popup.css">

    <!-- jquery-ui - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/jquery-ui.css">

    <!-- select option - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/nice-select.css">

    <!-- custom - css include -->
    <link rel="stylesheet" type="text/css" href="assets/css/style.css">

  </head>


  <body>

    <!-- body_wrap - start -->
    <div class="body_wrap">

      <!-- backtotop - start -->
      <div class="backtotop">
        <a href="#" class="scroll">
          <i class="far fa-arrow-up"></i>
        </a>
      </div>
      <!-- backtotop - end -->

      <!-- preloader - start -->
      <div id="preloader"></div>
      <!-- preloader - end -->

      <!-- header_section - start
      ================================================== -->
      <div th:replace="~{pet/common::common_header}"></div>
      <!-- header_section - end
      ================================================== -->

      <!-- main body - start
      ================================================== -->
      <main>

        <!-- sidebar cart - start
        ================================================== -->
        <div class="sidebar-menu-wrapper">
          <div class="cart_sidebar">
            <button type="button" class="close_btn"><i class="fal fa-times"></i></button>

            <ul class="cart_items_list ul_li_block mb_30 clearfix">
              <li>
                <div class="item_image">
                  <img src="assets/images/cart_img_1.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                </div>
                <div class="item_content">
                  <h4 class="item_title">Yellow Blouse</h4>
                  <span class="item_price">$30.00</span>
                </div>
                <button type="button" class="remove_btn"><i class="fal fa-trash-alt"></i></button>
              </li>
              <li>
                <div class="item_image">
                  <img src="assets/images/cart_img_2.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                </div>
                <div class="item_content">
                  <h4 class="item_title">Yellow Blouse</h4>
                  <span class="item_price">$30.00</span>
                </div>
                <button type="button" class="remove_btn"><i class="fal fa-trash-alt"></i></button>
              </li>
              <li>
                <div class="item_image">
                  <img src="assets/images/cart_img_1.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                </div>
                <div class="item_content">
                  <h4 class="item_title">Yellow Blouse</h4>
                  <span class="item_price">$30.00</span>
                </div>
                <button type="button" class="remove_btn"><i class="fal fa-trash-alt"></i></button>
              </li>
            </ul>

            <ul class="total_price ul_li_block mb_30 clearfix">
              <li>
                <span>Subtotal:</span>
                <span>$90</span>
              </li>
              <li>
                <span>Vat 5%:</span>
                <span>$4.5</span>
              </li>
              <li>
                <span>Discount 20%:</span>
                <span>- $18.9</span>
              </li>
              <li>
                <span>Total:</span>
                <span>$75.6</span>
              </li>
            </ul>

            <ul class="btns_group ul_li_block clearfix">
              <li><a class="btn btn_primary" href="cart.html">View Cart</a></li>
              <li><a class="btn btn_secondary" href="res.html">Checkout</a></li>
            </ul>
          </div>

          <div class="cart_overlay"></div>
        </div>
        <!-- sidebar cart - end
        ================================================== -->

        <!-- breadcrumb_section - start
        ================================================== -->
        <div class="breadcrumb_section">
          <div class="container">
            <ul class="breadcrumb_nav ul_li">
              <li><a href="index.html">Home</a></li>
              <li>Team</li>
            </ul>
          </div>
        </div>
        <!-- breadcrumb_section - end
        ================================================== -->

        <!-- team_section - start
        ================================================== -->
        <section class="team_section section_space">
          <div class="container">

            <div class="row justify-content-center">
              <div class="col col-md-7">
                <div class="team_section_title text-center">
                  <h2 class="title_text">Meet Our Team</h2>
                  <p class="mb-0">
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever 
                  </p>
                </div>
              </div>
            </div>

            <div class="row justify-content-center">
              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_1.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">Harry Dor</h3>
                    <span class="team_member_title">CEO/Founder</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_2.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">John Swim</h3>
                    <span class="team_member_title">Fashion Designer</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_3.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">Harry Dor</h3>
                    <span class="team_member_title">CEO/Founder</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_4.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">John Swim</h3>
                    <span class="team_member_title">Fashion Designer</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_5.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">Harry Dor</h3>
                    <span class="team_member_title">CEO/Founder</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_6.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">John Swim</h3>
                    <span class="team_member_title">Fashion Designer</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_7.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">Harry Dor</h3>
                    <span class="team_member_title">CEO/Founder</span>
                  </div>
                </div>
              </div>

              <div class="col col-lg-3 col-md-4 col-sm-6">
                <div class="team_item">
                  <div class="team_image">
                    <img src="assets/images/team_8.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                  </div>
                  <div class="team_content">
                    <h3 class="team_member_name">John Swim</h3>
                    <span class="team_member_title">Fashion Designer</span>
                  </div>
                </div>
              </div>
            </div>

          </div>
        </section>
        <!-- team_section - end
        ================================================== -->

        <!-- newsletter_section - start
        ================================================== -->
        <section class="newsletter_section">
          <div class="container">
            <div class="row align-items-center">
              <div class="col col-lg-6">
                <h2 class="newsletter_title text-white">
                  <i class="icofont-paper-plane"></i>
                  Sign Up for Newsletter
                </h2>
              </div>
              <div class="col col-lg-6">
                <form action="javascript:;">
                  <div class="newsletter_form">
                    <input type="email" name="email" placeholder="Enter your email address">
                    <button type="submit" class="btn btn_danger">Submit</button>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </section>
        <!-- newsletter_section - end
        ================================================== -->

      </main>
      <!-- main body - end
      ================================================== -->

      <!-- footer_section - start
      ================================================== -->
      <footer class="footer_section">
        <div class="footer_widget_area">
          <div class="container">
            <div class="row">
              <div class="col col-lg-4 col-md-6 col-sm-6">
                <div class="footer_widget footer_about">
                  <div class="brand_logo">
                    <a class="brand_link" href="index.html">
                      <img src="assets/images/site_logo.svg" alt="Getyootech - Gadgets Ecommerce Site Template">
                    </a>
                  </div>
                  <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                  </p>
                  <ul class="social_round ul_li">
                    <li><a href="#!"><i class="icofont-youtube-play"></i></a></li>
                    <li><a href="#!"><i class="icofont-instagram"></i></a></li>
                    <li><a href="#!"><i class="icofont-twitter"></i></a></li>
                    <li><a href="#!"><i class="icofont-facebook"></i></a></li>
                    <li><a href="#!"><i class="icofont-linkedin"></i></a></li>
                  </ul>
                </div>
              </div>

              <div class="col col-lg-2 col-md-3 col-sm-6">
                <div class="footer_widget footer_useful_links">
                  <h3 class="footer_widget_title text-uppercase">Quick Links</h3>
                  <ul class="ul_li_block">
                    <li><a href="about.html">About Us</a></li>
                    <li><a href="contact.html">Contact</a></li>
                    <li><a href="javascript:;">Products</a></li>
                    <li><a href="register.html">Login</a></li>
                    <li><a href="register.html">Sign Up</a></li>
                  </ul>
                </div>
              </div>

              <div class="col col-lg-2 col-md-3 col-sm-6">
                <div class="footer_widget footer_useful_links">
                  <h3 class="footer_widget_title text-uppercase">Custom area</h3>
                  <ul class="ul_li_block">
                    <li><a href="account.html">My Account</a></li>
                    <li><a href="wishlist.html">Wishlist</a></li>
                    <li><a href="order_tracking.html">Tracking List</a></li>
                    <li><a href="cart.html">My Cart</a></li>
                  </ul>
                </div>
              </div>

              <div class="col col-lg-4 col-md-6 col-sm-6">
                <div class="footer_widget footer_contact">
                  <h3 class="footer_widget_title text-uppercase">Contact Onfo</h3>
                  <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt. 
                  </p>
                  <div class="hotline_wrap">
                    <div class="footer_hotline">
                      <div class="item_icon">
                        <i class="icofont-headphone-alt"></i>
                      </div>
                      <div class="item_content">
                        <h4 class="item_title">Have any question?</h4>
                        <span class="hotline_number">(+880)1680636189</span>
                      </div>
                    </div>
                    <div class="livechat_btn clearfix">
                      <a class="btn border_primary" href="#!">Live Chat</a>
                    </div>
                  </div>
                  <ul class="store_btns_group ul_li">
                    <li><a href="#!"><img src="assets/images/app_store.webp" alt="app_store"></a></li>
                    <li><a href="#!"><img src="assets/images/play_store.webp" alt="play_store"></a></li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="footer_bottom">
          <div class="container">
            <div class="row align-items-center">
              <div class="col col-md-6">
                <p class="copyright_text">
                  <a href="javascript:;">WebThunder</a> © <b>Getyootech</b> Template. All rights reserved Copyrights 2023
                </p>
              </div>

              <div class="col col-md-6">
                <div class="payment_method">
                  <h4>Payment:</h4>
                  <img src="assets/images/payments_icon.webp" alt="Getyootech - Gadgets Ecommerce Site Template">
                </div>
              </div>
            </div>
          </div>
        </div>
      </footer>
      <!-- footer_section - end
      ================================================== -->

    </div>
    <!-- body_wrap - end -->

    <!-- fraimwork - jquery include -->
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/popper.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/js/bootstrap5-dropdown-ml-hack.js"></script>

    <!-- carousel - jquery include -->
    <script src="assets/js/slick.min.js"></script>

    <!-- popup - jquery include -->
    <script src="assets/js/magnific-popup.min.js"></script>

    <!-- jquery-ui - jquery include -->
    <script src="assets/js/jquery-ui.js"></script>

    <!-- off canvas sidebar - jquery include -->
    <script src="assets/js/mCustomScrollbar.js"></script>

    <!-- select option - jquery include -->
    <script src="assets/js/nice-select.min.js"></script>

    <!-- countdown timer - jquery include -->
    <script src="assets/js/countdown.js"></script>

    <!-- counter up - jquery include -->
    <script src="assets/js/counterup.min.js"></script>
    <script src="assets/js/waypoints.min.js"></script>

    <!-- custom - jquery include -->
    <script src="assets/js/main.js"></script>

  </body>
</html>